<template>
	<view class="container">
		<!-- 页面头部 -->
		<view class="header">
			<view class="title">
				<text>手机号登录</text>
			</view>
			<view class="sub-title">
				<text>未注册的手机号登录后将自动注册</text>
			</view>
		</view>
		<!-- 表单 -->
		<view class="login-form">
			<!-- 手机号 -->
			<view class="form-item">
				<input class="form-item--input" type="number" v-model="mobile" maxlength="11" placeholder="请输入手机号码" />

			</view>
			<!-- 图形验证码 -->
			<view class="form-item">
				<input class="form-item--input" type="text" v-model="imageCaptchaCode" maxlength="5"
					placeholder="请输入图形验证码" />
				<view class="form-item--parts">
					<view class="captcha" @click="getCaptcha()">
						<image class="image" :src="'data:image/png;base64,'+imageCaptcha.base64Str"></image>
					</view>
				</view>
			</view>
			<!-- 短信验证码 -->
			<view class="form-item">
				<input class="form-item--input" type="number" v-model="smsCode" maxlength="6" placeholder="请输入短信验证码" />
				<view class="form-item--parts">
					<view class="captcha-sms" @click="handelSmsCaptcha()">
						<text v-if="!smsState" class="activate">获取验证码</text>
						<text v-else class="un-activate">重新发送({{ times }})秒</text>
					</view>
				</view>
			</view>
			<!-- 登录按钮 -->
			<view class="login-button" @click="handleLogin">
				<text>登录</text>
			</view>
			<view class="no-login-btn" @click="handleCancel">
				<text>暂不登录</text>
			</view>
		</view>

		<!-- 微信授权手机号一键登录 -->
		<!-- #ifdef MP-WEIXIN -->
		<MpWeixinMobile :isParty="true" :partyData="partyData" />
		<!-- #endif -->

	</view>
</template>
<script>
	import MpWeixinMobile from './components/mp-weixin-mobile'
	import SettingKeyEnum from '@/common/enum/setting/Key'
	import SettingModel from '@/common/model/Setting'
	import store from '@/store'
	import * as Verify from '@/utils/verify'
	import * as apiCaptcha from '@/api/sys/captcha'

	export default {
		components: {
			MpWeixinMobile,
		},

		data() {
			return {
				// 数据加载完成 [防止在微信小程序端onLoad和view渲染同步进行]
				isLoad: false,
				// 是否显示微信小程序授权登录
				isMpWeixinAuth: false,
				// 是否存在第三方用户信息
				isParty: true,
				// 第三方用户信息数据
				partyData: {},
				// base64Str: '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',
				// 图形验证码信息
				imageCaptcha: {
					// base64Str: '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'
				},
				//短信验证码信息
				smsCaptcha: {},
				// 短信验证码发送状态
				smsState: false,
				// 倒计时
				times: 60,
				// 手机号
				mobile: '',
				// 图形验证码
				imageCaptchaCode: '',
				// 短信验证码
				smsCode: ''
			}
		},

		/**
		 * 生命周期函数--监听页面加载
		 */
		async onLoad(options) {
			const _this = this
			// #ifdef  MP || MP-WEIXIN
			console.log("运行在微信小程序平台");
			_this.loginWx();

			// #endif
			// 设置当前是否显示微信小程序授权登录
			// await _this.setShowUserInfo(options.isBindPhone)
			_this.getCaptcha()
			// 数据加载完成
			_this.isLoad = true
			console.log('isLoad', _this.base64Str)
		},

		methods: {

			// 微信获取微信Code登录
			// 1.将code提交到后端，如果存在该用户 则自动登录.如无则自动注册
			// 2.检查是否已绑定手机号,未绑定则停留当前页面绑定手机号,已绑定则返回原页面
			// 3.如果后端报错了, 则显示错误信息
			async loginWx() {
				const _this = this
				var wxCode = await _this.getWxCode();
				console.log("wxCode", wxCode)
				var reqData = {
					wxCode: wxCode,
					oauth: 'MP-WEIXIN',
					// refereeId: store.getters.refereeId
				};
				// return
				// 提交到后端
				store.dispatch('loginWx', reqData).then(data => {
						// 一键登录成功
						_this.$toast("微信静默登录成功!")
						//未绑定手机号跳转到绑定手机号
						if (!data.wxInfo.isBindPhone) {
							// _this.getCaptcha()
							// return
						} else {
							// 相应全局事件订阅: 刷新上级页面数据
							uni.$emit('syncRefresh', true)
							// 跳转回原页面
							setTimeout(() => _this.onNavigateBack(), 2000)
						}
					})
					.catch(err => {
						console.log("errwx111", err)
						uni.showToast({
							title: err.errMsg,
							icon: "none",
							duration: 2500
						}, 10)
					})
			},
			// 获取 wxCode
			// https://developers.weixin.qq.com/miniprogram/dev/api/open-api/login/wx.login.html
			getWxCode() {
				return new Promise((resolve, reject) => {
					uni.login({
						provider: 'weixin',
						success: res => {
							console.log('code', res.code)
							resolve(res.code)
						},
						fail: reject
					})
				})
			},

			// 点击登录
			handleLogin() {
				const _this = this
				if (!_this.isLoading && _this.formValidation("SubmitLogin")) {
					_this.submitLogin()
				}
			},
			// 暂不登录
			handleCancel() {
				const _this = this
				uni.switchTab({
					url: '/pages/index/index'
				})
			},
			// 确认登录
			submitLogin() {
				const _this = this
				_this.isLoading = true
				store.dispatch('LoginByPhoneCode', {
						smsVerifyCodeId: _this.smsCaptcha.verifyCodeId,
						smsCode: _this.smsCode,
						Mobile: _this.mobile,
						isParty: _this.isParty,
						partyData: _this.partyData
					})
					.then(result => {
						// 显示登录成功
						_this.$toast(result.message)
						// 相应全局事件订阅: 刷新上级页面数据
						uni.$emit('syncRefresh', true)
						// 跳转回原页面
						setTimeout(() => _this.onNavigateBack(1), 2000)
					})
					.catch(err => {
						console.log("err", err)
						// 跳转回原页面
						if (err.result.data.isBack) {
							setTimeout(() => _this.onNavigateBack(1), 2000)
						}
					})
					.finally(() => _this.isLoading = false)
			},

			onNavigateBack(delta = 1) {
				const pages = getCurrentPages()
				if (pages.length > 1) {
					uni.navigateBack({
						delta: Number(delta || 1)
					})
				} else {
					this.$navTo('pages/index/index')
				}
			},
			// 获取图形验证码
			getCaptcha() {
				const _this = this
				apiCaptcha.getImageCaptcha()
					.then(res => {
						_this.imageCaptcha = res.result
						console.log("1111111111", _this.imageCaptcha.base64Str)
					})
			},

			// 点击发送短信验证码
			handelSmsCaptcha() {
				const _this = this
				if (!_this.isLoading && !_this.smsState && _this.formValidation('GetCaptcha')) {
					_this.sendSmsCaptcha()
				}
			},

			// 表单验证
			formValidation(scene = "GetCaptcha") {
				const _this = this
				// 验证获取短信验证码
				if (scene === "GetCaptcha") {
					console.log("11", _this.mobile)
					if (!_this.validteMobile(_this.mobile) || !_this.validteImageCaptchaCode(_this
							.imageCaptchaCode)) {
						return false
					}
				}
				// 验证提交登录
				if (scene === "SubmitLogin") {
					if (!_this.validteMobile(_this.mobile) || !_this.validteSmsCode(_this.smsCode)) {
						return false
					}
				}
				return true
			},

			// 验证手机号
			validteMobile(str) {
				if (Verify.isEmpty(str)) {
					this.$toast('请先输入手机号')
					return false
				}
				if (!Verify.isMobile(str)) {
					this.$toast('请输入正确格式的手机号')
					return false
				}
				return true
			},

			// 验证图形验证码
			validteImageCaptchaCode(str) {
				if (Verify.isEmpty(str)) {
					this.$toast('请先输入图形验证码')
					return false
				}
				return true
			},

			// 验证短信验证码
			validteSmsCode(str) {
				if (Verify.isEmpty(str)) {
					this.$toast('请先输入短信验证码')
					return false
				}
				return true
			},

			// 请求发送短信验证码接口
			sendSmsCaptcha() {
				const _this = this
				_this.isLoading = true
				apiCaptcha.sendSmsCaptcha({
						verifyCodeId: _this.imageCaptcha.verifyCodeId,
						verifyCode: _this.imageCaptchaCode,
						Mobile: _this.mobile
					})
					.then(res => {
						// 显示发送成功
						_this.$toast(res.message)
						_this.smsCaptcha = res.result;
						// 执行定时器
						_this.timer()
					})
					.catch(() => _this.getCaptcha())
					.finally(() => _this.isLoading = false)
			},

			// 执行定时器
			timer() {
				const _this = this
				_this.smsState = true
				const inter = setInterval(() => {
					_this.times = _this.times - 1
					if (_this.times <= 0) {
						_this.smsState = false
						_this.times = 60
						clearInterval(inter)
					}
				}, 1000)
			},
		}
	}
</script>

<style lang="scss" scoped>
	.container {
		padding: 100rpx 60rpx;
		min-height: 100vh;
		background-color: #fff;
	}

	// 页面头部
	.header {
		margin-bottom: 60rpx;

		.title {
			color: #191919;
			font-size: 54rpx;
		}

		.sub-title {
			margin-top: 20rpx;
			color: #b3b3b3;
			font-size: 28rpx;
		}
	}

	// 输入框元素
	.form-item {
		display: flex;
		padding: 18rpx;
		border-bottom: 1rpx solid #f3f1f2;
		margin-bottom: 30rpx;
		height: 96rpx;

		&--input {
			font-size: 28rpx;
			letter-spacing: 1rpx;
			flex: 1;
			height: 100%;
		}

		&--parts {
			min-width: 100rpx;
			height: 100%;
		}

		// 图形验证码
		.captcha {
			height: 100%;

			.image {
				display: block;
				width: 192rpx;
				height: 100%;
			}
		}

		// 短信验证码
		.captcha-sms {
			font-size: 28rpx;
			line-height: 50rpx;
			padding-right: 20rpx;

			.activate {
				color: #cea26a;
			}

			.un-activate {
				color: #9e9e9e;
			}
		}
	}


	// 登录按钮
	.login-button {
		width: 100%;
		height: 86rpx;
		margin-top: 80rpx;
		background: linear-gradient(to right, #ecb53c, #ff9211);
		color: #fff;
		border-radius: 80rpx;
		box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.1);
		letter-spacing: 5rpx;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	// 暂不登录
	.no-login-btn {
		width: 100%;
		height: 86rpx;
		margin-top: 25rpx;
		background: #dfdfdf;
		color: #999;
		border-radius: 80rpx;
		box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.1);
		letter-spacing: 5rpx;
		display: flex;
		justify-content: center;
		align-items: center;
	}
</style>